<template>
  <div class="page-view">
    <van-field
      v-model="RealName"
      clearable
      placeholder="请填写真实姓名，提交后不可修改"
      class="form"
    />
    <div class="btn-div">
      <van-button
        type="primary"
        class="btn"
        @click="onSubmit"
      >
        确定
      </van-button>
    </div>
  </div>
</template>
<script lang="ts">
import Vue from 'vue'
import { SET_USER_INFO } from '@/store/mutations'
export default Vue.extend({
  data () {
    return {
      RealName: '',
    }
  },
  methods: {
    isValidateRealName () {
      if (this.RealName === '') {
        this.$toast('请输入您的真实姓名！')
        return false
      }
      if (this.RealName.length > 10) {
        this.$toast('姓名不能超过10个字！')
      } else {
        return true
      }
    },
    // 提交
    onSubmit () {
      if (this.isValidateRealName()) {
        this.$axios({
          url: 'Setting/UpdateUserInfo',
          data: {
            Type: 2, // RealName
            Content: this.RealName,
          },
        }).then(res => {
          this.$store.commit(SET_USER_INFO, { RealName: this.RealName })
          this.$router.back()
          setTimeout(() => {
            this.$toast({ message: '更新成功！', duration: 1000 })
          }, 100)
        })
      }
    },
  },
})
</script>
<style lang="scss" scoped>
@import "~scss/mine/changeInfo.scss";
</style>
